<template>
  <el-select v-model="code" :placeholder="placeholder" :multiple="multiple" :clearable="clearable" style="width:100%;" :disabled="disabled">
    <el-option v-for="item in appList" :key="item.id" :value="item[type]" :label="item[type]"></el-option>
  </el-select>
</template>

<script>
  export default {
    data() {
      return {
        appList: [],
        code: this.value
      };
    },
    props: {
      type: {
        type: String,
        default: 'name'
      },
      value: {
        type: [String, Array],
        default: ''
      },
      placeholder: {
        type: String,
        default: ''
      },
      disabled: {
        type: Boolean,
        default: false
      },
      clearable: {
        type: Boolean,
        default: true
      },
      multiple: {
        type: Boolean,
        default: false
      }
    },
    watch: {
      code(val, oldVal) {
        if (val !== oldVal) {
          this.$emit('input', this.code);
          this.$emit('change');
        }
      },
      value(val, oldVal) {
        this.code = val;
      }
    },
    methods: {
      async getAppList() {
        const params = {
          appListDomain: this.$storage.get('user').domain
        };
        const {
          status,
          data,
          error
        } = await this.$api.systemManage.getAppListdomain(params);
        if ('1' === status && error === '00000000') {
          this.appList = data || [];
          this.$emit('giveParentData', data);
        }
      }
    },
    created() {
      this.getAppList();
    }
  };
</script>

<style scoped>
</style>

